<script setup>
import axios from "axios";
const emit = defineEmits(['update:modelValue'])
const props = defineProps({
  modelValue: {
    type: String
  },
  requestParams: {
    type: Object,
    required: true
  },
  url: {
    type: String,
    required: true
  },
  value: {
    type: String,
    required: true
  },
  name: {
    type: String,
    required: true
  }
})


import {onActivated, onMounted, reactive, ref, toRef, toRefs} from "vue";

const value = ref('')


const options = ref([
  {
    value: 'Option1111',
    label: 'Option223331',
  },
  {
    value: 'Option2',
    label: 'Option2',
  },
  {
    value: 'Option3',
    label: 'Option3',
  },
  {
    value: 'Option5',
    label: 'Option5',
  },
])
const getSelectData = async () => {

  axios({
    method: 'post',
    url: props.url,
    data: props.requestParams,
  }).then(response => {

    options.value = response.data
  })
}
onMounted(() => {
  getSelectData();
})
</script>

<template>

  <el-select v-model="value" class="m-2" @change="emit('update:modelValue', value)" placeholder="Select" size="large">
    <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
    />
  </el-select>

</template>

<style scoped>

</style>
